<template>
  <div class="a-son">
    子组件1
    <p>{{ title }}</p>
    {{ FatherList || [] }}
    <button @click="changeTitle">修改标题</button>
    <button @click="changePink">修改颜色</button>
    <button @click="changeRest">清空数据</button>
  </div>
</template>
<script>
export default {
  components: {},
  // props 校验
  props: {
    title: {
      type: String,
      required: true,
    },
    FatherList: {
      type: Array,
    },
  },
  data() {
    return {};
  },
  computed: {},
  created() {},
  mounted() {},
  methods: {
    changeTitle() {
      this.$emit("subTitle", "父子组件通信");
    },
    changePink() {
      this.$emit("subPink");
    },
    changeRest() {
      this.$emit("subRest");
    },
  },
  watch: {},
};
</script>
<style scoped lang='less'>
.a-son {
  padding: 10px;
}
</style>
